<template>
    <el-container>
        <el-header>
            <cli-title-student></cli-title-student>
        </el-header>
        <el-main>
            <div class="center">
                <el-tabs v-model="activeName" :tab-position="tabPosition">
                    <el-tab-pane v-if="isTeacher" label="博客" name="first">
                        <div class="insideTab">
                            <el-button type="primary" plain style="right: 60px" @click="toDraftBlog">
                                <i class="el-icon-edit"></i>撰写博客
                            </el-button>
                            <self-bloglist></self-bloglist>
                        </div>
                    </el-tab-pane>
                    <el-tab-pane label="知识库" name="second">
                        <div class="insideTab">
                            <el-button type="primary" plain style="right: 60px" @click="toDraftRepository">
                                <i class="el-icon-edit"></i>增加知识库
                            </el-button>
                            <self-repositories></self-repositories>
                        </div>
                    </el-tab-pane>
                    <el-tab-pane label="课程" name="third">
                        <div class="insideTab">
                            <courselist></courselist>
                        </div>
                    </el-tab-pane>
                </el-tabs>
            </div>
        </el-main>
        <el-footer></el-footer>
    </el-container>
</template>

<script>

    import CliTitleStudent from "../../components/base/cliTitleStudent";
    import bloglist from "../../components/list/bloglist";
    import pageFooter from "../../components/base/pageFooter";
    import Courselist from "../../components/list/courselist";
    import SelfRepositories from "../../components/list/self-repositories";
    import SelfBloglist from "../../components/list/self-bloglist";
    import Cookies from 'js-cookie'

    export default {
        name: "homepage",
        components: {
            SelfBloglist,
            SelfRepositories,
            Courselist, pageFooter, bloglist, CliTitleStudent
        },
        data() {
            return {
                tabPosition: 'left',
                activeName: 'second',
                id:'',
                isTeacher: true,
                info:[]
            };
        },
        methods: {
            toDraftBlog() {
                this.$router.push({path: '/blog/draftblog'});
            }, toDraftRepository() {
                this.$router.push({path: '/repository/draftrepository'});
            }
        },
        mounted() {
            this.info = Cookies.get('info');
            this.info = JSON.parse(this.info);
            console.log(this.info);
            this.id = this.info.account;
            this.isTeacher = this.info.role === 1;
            console.log(this.id);
        }
    }
</script>

<style scoped>
    .center {
        width: 800px;
        margin: 50px auto;
    }

    .insideTab {
        margin-left: 50px;
    }
</style>
